{%- from "notify/admin/macros.jinja" import render_attributes -%}

{# Render monolingual fields #}
<div class="row">
    <div class="col-md-10 col-md-offset-1">
        {% for field in form.base %}
            {{ bs3.field(field) }}
        {% endfor %}
    </div>
</div>
<hr>
<div class="row">
    <div class="col-md-10 col-md-offset-1">
        <div class="row">
            <div class="col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2">
                {# Render multilingual fields #}
                <ul class="nav nav-tabs" id="main-tabs" role="tablist">
                    {% for f in form.forms %}
                        {% if f in languages %}
                        <li role="presentation" class="nav-item" {% if f==default_language %}class="nav-item active" {% endif %}><a href="#lang-{{ f }}" role="tab" data-toggle="tab" class="nav-link">{{ languages[f] }}</a></li>
                        {% endif %}
                    {% endfor %}
                </ul>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12">
                <div class="tab-content">
                    {% for f in form.forms %}
                        {% if f in languages %}
                        <div id="lang-{{ f }}" class="tab-pane {% if f==default_language %}active{% endif %}" role="tabpanel">
                            {% for field in form.forms[f] %}
                                {{ bs3.field(field) }}
                            {% endfor %}
                            {% if script_template.event.variables %}
                            <div class="form-group">
                                <label></label>
                                <span class="text-info">
                                    <i class="fa fa-info-circle"></i> <a data-toggle="modal" data-target="#variablesModal" href="#">{{ _("Show available variables") }}</a>
                                </span>
                            </div>
                            {% endif %}
                        </div>
                        {% endif %}
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal" id="variablesModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <ul class="list-group">
                {% for variable_identifier, variable_info in script_template.event.variables|dictsort %}
                <li class="list-group-item">
                    <span class="text-info">{{ variable_info.name }}</span>
                    <br><code>{{ '{{ ' ~ variable_identifier ~ ' }}' }}</code>
                    <br>{{ variable_info.help_text|default("") }}
                    {{ render_attributes(variable_identifier, variable_info) }}
                </li>
                {% endfor %}
            </ul>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">{{ _("Close") }}</button>
            </div>
        </div>
    </div>
</div>
